<template>
  <div class="home-swiper">
    <van-swipe v-if="sliderList.length" class="home-swipe" :autoplay="3000" indicator-color="white">
      <van-swipe-item v-for="l in sliderList" :key="l.url">
        <van-image height="200" :src="l.url" fit="cover" />
      </van-swipe-item>
    </van-swipe>
  </div>
</template>

<script lang="ts">
import component from '*.vue';
import { IGlobalState } from '@/store';
import { computed, defineComponent } from 'vue';
import { useStore } from 'vuex';
import * as Types from '@/store/action-types';

export default defineComponent({
  name: 'HomeSwiper',
  components: {
    
  },
  async setup() {
    let store = useStore<IGlobalState>();

    let sliderList = computed(() => store.state.home.sliders);
    if(sliderList.value.length == 0) {
      await store.dispatch(`home/${Types.SET_SLIDER_LIST}`)
    }

    return {
      sliderList
    }
  }
});
</script>

<style lang="scss">
.home-swiper {
  .home-swipe {
    
  }
}
</style>
